<!-- 文件描述：本网页是网站主页 -->
{% extends "base.html" %}

{% block other_link_value %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/detail.css') }}">
{% endblock %}

{% block title_value %}
{{ question.title }}
{% endblock %}

{% block container_value %}
<div class="row" style="margin-top: 20px;">
    <div class="col"></div>

    <div class="col-10" style="background-color: #fff;padding: 20px;">
        <h3 class="page-title">{{ question.title }}</h3>
        <p class="question-info">
            <span>{{ user.username }}</span>
            <span>{{ question.create_time }}</span>
        </p>
        <hr>
        <p class="question-content">{{ question.content }}</p>
        <hr>

        <h4 class="comment-group-title">评论（{{ question.answers|length }}）</h4>
        <form action="{{ url_for('qa.public_answer') }}" method="post">
            <div class="form-group">
                <input type="text" placeholder="请填写评论" name="content" class="form-control">
                <input type="hidden" name="question_id" value="{{ question.id }}"> <!-- hidden 代表在页面隐藏, 也依旧会进行提交 -->
            </div>
            <div class="form-group" style="text-align: right;">
                <button class="btn btn-primary">评论</button>
            </div>
        </form>

        <ul class="comment-group">
            {% for comment in comments %}
                <li>
                    <div class="user-info">
                        <img class="avatar" src="{{ url_for('static', filename='images/my.jpg') }}" alt="">
                        <span class="username">{{ comment.author.username }}</span>
                        <span class="create-time">{{ comment.create_time }}</span>
                    </div>
                    <p class="comment-content">{{ comment.content }}</p>
                </li>
            {% endfor %}
        </ul>
    </div>

    <div class="col"></div>
</div>
{% endblock %}